Type | Badges | Labels |
---|---|---|
Default | 1 1 | Default Default Stroke |
Primary | 1 1 | Primary Primary Stroke |
Success | 2 2 | Success Success Stroke |
Warning | 4 4 | Warning Warning Stroke |
Danger | 6 6 | Danger Danger Stroke |
Info | 8 8 | Info Info Stroke |
Inverse | 10 10 | Inverse Inverse Stroke |
<table class="table table-bordered"> <thead> <tr> <th>Type</th> <th>Badges</th> <th>Labels</th> </tr> </thead> <tbody> <tr> <td>Default</td> <td> <span class="badge">1</span> <span class="badge badge-stroke">1</span> </td> <td> <span class="label label-default">Default</span> <span class="label label-default label-stroke">Default Stroke</span> </td> </tr> <tr> <td>Primary</td> <td> <span class="badge badge-primary">1</span> <span class="badge badge-primary badge-stroke">1</span> </td> <td> <span class="label label-primary">Primary</span> <span class="label label-primary label-stroke">Primary Stroke</span> </td> </tr> <tr> <td>Success</td> <td> <span class="badge badge-success">2</span> <span class="badge badge-success badge-stroke">2</span> </td> <td> <span class="label label-success">Success</span> <span class="label label-success label-stroke">Success Stroke</span> </td> </tr> <tr> <td>Warning</td> <td> <span class="badge badge-warning">4</span> <span class="badge badge-warning badge-stroke">4</span> </td> <td> <span class="label label-warning">Warning</span> <span class="label label-warning label-stroke">Warning Stroke</span> </td> </tr> <tr> <td>Danger</td> <td> <span class="badge badge-danger">6</span> <span class="badge badge-danger badge-stroke">6</span> </td> <td> <span class="label label-danger">Danger</span> <span class="label label-danger label-stroke">Danger Stroke</span> </td> </tr> <tr> <td>Info</td> <td> <span class="badge badge-info">8</span> <span class="badge badge-info badge-stroke">8</span> </td> <td> <span class="label label-info">Info</span> <span class="label label-info label-stroke">Info Stroke</span> </td> </tr> <tr> <td>Inverse</td> <td> <span class="badge badge-inverse">10</span> <span class="badge badge-inverse badge-stroke">10</span> </td> <td> <span class="label label-inverse">Inverse</span> <span class="label label-inverse label-stroke">Inverse Stroke</span> </td> </tr> </tbody> </table>
@import "assets/components/core/less/labels.less";
<head>
section of your HTML document, before any JavaScript files: <link type="stylesheet/less" href="styles.less" />
NOTE All the styles from the CORE package also need to be imported in this file, before the component imports.